import {
    OpenIdIdentityIssuerType,
    type OpenIdIdentitySummary,
} from '@lightdash/common';
import { Button, Image, type ButtonProps } from '@mantine/core';
import { IconLock } from '@tabler/icons-react';
import { type FC, type ReactNode } from 'react';
import useApp from '../../../providers/App/useApp';
import MantineIcon from '../MantineIcon';

type ThirdPartySignInButtonProps = {
    inviteCode?: string;
    intent?: 'signin' | 'add' | 'signup';
    providerName: OpenIdIdentitySummary['issuerType'];
    // Default redirect is the current window.location.href
    redirect?: string;
} & ButtonProps;

const ThirdPartySignInButtonBase: FC<
    {
        loginPath: string;
        logo: string | ReactNode;
        providerName: string;
        redirect?: string;
    } & Pick<ThirdPartySignInButtonProps, 'inviteCode' | 'intent'> &
        ButtonProps
> = ({
    loginPath,
    inviteCode,
    logo,
    providerName,
    intent,
    redirect,
    ...props
}) => {
    return (
        <Button
            variant="default"
            color="gray"
            component="a"
            href={`/api/v1${loginPath}?redirect=${encodeURIComponent(
                redirect || window.location.href,
            )}${
                inviteCode
                    ? `&inviteCode=${encodeURIComponent(inviteCode)}`
                    : ''
            }`}
            leftIcon={
                typeof logo === 'string' ? (
                    <Image
                        width={16}
                        src={logo}
                        alt={`${providerName} logo}`}
                    />
                ) : (
                    logo
                )
            }
            sx={{ ':hover': { textDecoration: 'underline' } }}
            {...props}
        >
            {intent === 'signup' && `Sign up with ${providerName}`}
            {intent === 'signin' && `Sign in with ${providerName}`}
            {intent === 'add' && 'Add +'}
        </Button>
    );
};

export const ThirdPartySignInButton: FC<ThirdPartySignInButtonProps> = ({
    inviteCode,
    intent = 'signin',
    providerName,
    redirect,
    ...props
}) => {
    const { health } = useApp();

    switch (providerName) {
        case OpenIdIdentityIssuerType.GOOGLE:
            return health.data?.auth.google.enabled ? (
                <ThirdPartySignInButtonBase
                    loginPath={health.data.auth.google.loginPath}
                    redirect={redirect}
                    intent={intent}
                    inviteCode={inviteCode}
                    providerName="Google"
                    logo=""
                    {...props}
                />
            ) : null;

        case OpenIdIdentityIssuerType.OKTA:
            return health.data?.auth.okta.enabled ? (
                <ThirdPartySignInButtonBase
                    loginPath={health.data.auth.okta.loginPath}
                    redirect={redirect}
                    intent={intent}
                    inviteCode={inviteCode}
                    providerName="Okta"
                    logo=""
                    {...props}
                />
            ) : null;
        case OpenIdIdentityIssuerType.ONELOGIN:
            return health.data?.auth.oneLogin.enabled ? (
                <ThirdPartySignInButtonBase
                    loginPath={health.data.auth.oneLogin.loginPath}
                    redirect={redirect}
                    intent={intent}
                    inviteCode={inviteCode}
                    providerName="OneLogin"
                    logo=""
                    {...props}
                />
            ) : null;

        case OpenIdIdentityIssuerType.AZUREAD:
            return health.data?.auth.azuread.enabled ? (
                <ThirdPartySignInButtonBase
                    loginPath={health.data.auth.azuread.loginPath}
                    redirect={redirect}
                    intent={intent}
                    inviteCode={inviteCode}
                    providerName="Microsoft"
                    logo=""
                    {...props}
                />
            ) : null;
        case OpenIdIdentityIssuerType.GENERIC_OIDC:
            return health.data?.auth.oidc.enabled ? (
                <ThirdPartySignInButtonBase
                    loginPath={health.data.auth.oidc.loginPath}
                    redirect={redirect}
                    intent={intent}
                    inviteCode={inviteCode}
                    providerName="OpenID Connect"
                    logo={<MantineIcon icon={IconLock} />}
                    {...props}
                />
            ) : null;
    }
};
